<template>
	<el-button type="primary" @click="back()">返回</el-button>
	<div class="Lable">
		<span>评论人</span>
		<span>商品信息</span>
		<span>评论时间</span>
		<span>订单号</span>
	</div>
	<div class="Prop">
		<span>{{CommentData.userName}}</span>
		<span>{{CommentData.wareName}}</span>
		<span>{{CommentData.opinionTime}}</span>
		<span>{{CommentData.opinionId}}</span>
	</div>
	<div style="margin-top: 50px;">
		<span>评论内容</span>
		<div style="margin-top: 20px;border: 1px solid black;">
			<div style="margin-left: 20px;">
				<p style="margin-bottom: 20px;">{{CommentData.opinionContent}}</p>
				<img style="width:180px;height:180px;margin-right: 20px;object-fit: cover;" v-for="x in imgUrl" :src="baseUrl+x" alt="" />
			</div>
		</div>
	</div>
</template>

<script setup lang="ts">
import { ref } from 'vue';
	const CommentData=JSON.parse(sessionStorage.getItem("user"))
	console.log(CommentData)
	import { useRouter } from 'vue-router';
	import {baseUrl} from "../utils/request.ts"
	
	let router=useRouter()
	const back = ()=>{
		router.push('/commentManage')
	}
	let imgUrl =ref([])
	imgUrl=CommentData.opinionImages.split(",")
	console.log(imgUrl)
</script>

<style scoped>
	.Lable{
		margin-top: 20px;
		display: flex;
		justify-content: space-between;
	}
/* 	.Lable span{
		margin-left:100px;
	} */

	.Prop{
		color: #ccc;
		margin-top: 20px;
		display: flex;
		justify-content: space-between;
	}
</style>